import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import { useAuth } from '../composables/useAuth'
import BreedDetailView from '../views/BreedDetailView.vue'
import MemberCenterView from '../views/MemberCenterView.vue'
import PetKnowledgeView from '../views/PetKnowledgeView.vue'
import PetKnowledgeCategoryView from '../views/PetKnowledgeCategoryView.vue'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      name: 'home',
      component: HomeView,
    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (About.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import('../views/AboutView.vue'),
    },
    {
      path: '/login',
      name: 'login',
      component: () => import('../views/LoginView.vue'),
      meta: {
        requiresGuest: true // 此路由只允许未登录用户访问
      }
    },
    {
      path: '/register',
      name: 'register',
      component: () => import('../views/RegisterView.vue'),
      meta: {
        requiresGuest: true // 此路由只允许未登录用户访问
      }
    },
    {
      path: '/profile',
      name: 'profile',
      component: () => import('../views/ProfileView.vue'),
      meta: {
        requiresAuth: true // 此路由需要登录才能访问
      }
    },
    {
      path: '/membership',
      name: 'membership',
      component: () => import('../views/MembershipView.vue'),
      meta: {
        requiresAuth: true // 此路由需要登录才能访问
      }
    },
    {
      path: '/membership/detail',
      name: 'membershipDetail',
      component: () => import('../views/MembershipDetailView.vue'),
      meta: {
        requiresAuth: true // 此路由需要登录才能访问
      }
    },
    {
      path: '/breeds',
      name: 'breeds',
      component: () => import('../views/BreedsView.vue'),
    },
    {
      path: '/breeds/cats',
      name: 'catBreeds',
      component: () => import('../views/CatBreedsView.vue'),
    },
    {
      path: '/breeds/dogs',
      name: 'dogBreeds',
      component: () => import('../views/DogBreedsView.vue'),
    },
    {
      path: '/breeds/small-pets',
      name: 'smallPets',
      component: () => import('../views/SmallPetsView.vue'),
    },
    {
      path: '/care',
      name: 'care',
      component: () => import('../views/CareView.vue'),
    },
    {
      path: '/training',
      name: 'training',
      component: () => import('../views/TrainingView.vue'),
    },
    {
      path: '/nutrition',
      name: 'nutrition',
      component: () => import('../views/NutritionView.vue'),
    },
    {
      path: '/breed/:id',
      name: 'breed-detail',
      component: BreedDetailView,
    },
    {
      path: '/member-center',
      name: 'member-center',
      component: MemberCenterView,
      meta: {
        requiresAuth: true // 此路由需要登录才能访问
      }
    },
    {
      path: '/pet-knowledge',
      name: 'pet-knowledge',
      component: PetKnowledgeView,
    },
    {
      path: '/pet-knowledge/:categoryId',
      name: 'pet-knowledge-category',
      component: PetKnowledgeCategoryView,
    },
    {
      path: '/pet-knowledge/article/:id',
      name: 'pet-knowledge-article',
      component: () => import('../views/PetKnowledgeArticleView.vue'),
    },
  ],
})

// 路由守卫
router.beforeEach((to, from, next) => {
  // 使用useAuth组合式函数
  const { isAuthenticated } = useAuth()
  
  // 检查路由是否需要登录
  if (to.meta.requiresAuth) {
    // 如果用户未登录，重定向到登录页面
    if (!isAuthenticated()) {
      next({ name: 'login' })
    } else {
      next()
    }
  } 
  // 检查路由是否只允许未登录用户访问
  else if (to.meta.requiresGuest) {
    // 如果用户已登录，重定向到个人主页
    if (isAuthenticated()) {
      next({ name: 'profile' })
    } else {
      next()
    }
  } 
  // 其他路由直接通过
  else {
    next()
  }
})

export default router
